import React from 'react';
import {useState} from 'react';
import type {Node} from 'react';
import {SafeAreaView, StatusBar, Text, Button, TextInput} from 'react-native';
import RTNCalculator from 'rtn-calculator/js/NativeCalculator.ts';

export default function RunJava() {
  const [result, setResult] = useState<number | null>(null);
  const [paramA, setParamA] = useState<number | string>("");
  const [paramB, setParamB] = useState<number | string>("");
  
  const handleParamAChange = (text: string) => {
    const num = parseFloat(text);
    if (!isNaN(num)) {
      setParamA(num);
    }else{
      setParamA("");
    }
  };

  const handleParamBChange = (text: string) => {
    const num = parseFloat(text);
    console.log(num);

    if (!isNaN(num)) {
      setParamB(num);
    }else{
      setParamB("");
    }
  };
  return (
    <SafeAreaView>
      <StatusBar barStyle={'dark-content'} />
      <TextInput placeholder="Enter paramA" onChangeText={handleParamAChange} value={`${paramA}`} style={{marginLeft: 1,borderColor: 'black',borderWidth: 1,marginTop: 20}}  />
      <TextInput placeholder="Enter paramB" onChangeText={handleParamBChange} value={paramB.toString()} style={{marginLeft: 1,borderColor: 'black',borderWidth: 1,marginTop: 20}} />
      <Text style={{marginLeft: 20, marginTop: 20}}>
        {paramA}+{paramB}={result ?? '??'}
      </Text>
      <Button
        title="Compute"
        onPress={async () => {
          const value = await RTNCalculator.add(paramA, paramB);
          setResult(value);
        }}
      />
    </SafeAreaView>
  );
}